<!DOCTYPE html>
<html lang="en" class="x-admin-sm" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4"><head>
    <meta charset="UTF-8">
    <title>修改密码界面</title>
    <header th:replace="header::html"></header>
    <link th:href="@{/xadmin/lib/layui/css/layui.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/xadmin/lib/layui/layui.js}" type="text/javascript"></script>
</head>
<body>
<div class="div1" style="margin: auto;width: 25%;padding: 10%">
    <span th:if="${ #authentication?.principal} !=null">
            <span th:if="${#authentication.principal.rid}!=5">
                <i id="rid" style="display: none">rid</i>
            </span>
    </span>
    <div class="layui-form-item">
        <label class="layui-form-label">账户</label>
        <div class="layui-input-inline">
            <input type="text" name="title" required lay-verify="required"  autocomplete="off"
                   class="layui-input" id="account" disabled=“disabled” th:value="${account}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">原密码</label>
        <div class="layui-input-inline">
            <input type="password" name="password" required lay-verify="required"  autocomplete="off"
                   placeholder="请输入旧密码"     class="layui-input" id="pass" >
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">新密码</label>
        <div class="layui-input-inline">
            <input type="password" name="password" required lay-verify="required"  autocomplete="off"
                   placeholder="请输入新密码"      class="layui-input" id="pass1" >
            <span  style="display:none;color:red"  id="danger">两次密码不一致</span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">确认新密码</label>
        <div class="layui-input-inline">
            <input type="password" name="password" required lay-verify="required"  autocomplete="off"
                   placeholder="请确认新密码"      class="layui-input" id="pass2" >
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formDemo" id="loginUser" onclick="changePassword()">修改密码</button>
        </div>
    </div>

</div>

</body>
<script>

	function changePassword() {
		var accountU=document.getElementById("account").value;
		var oldPass=document.getElementById("pass").value;
		var pass1=document.getElementById("pass1").value;
		var pass2=document.getElementById("pass2").value;

		if (account!=""&&pass!=""&&pass1!=""&&pass2!=""){
			if (pass1===pass2) {
				if (isPasswd(pass1)) {
					document.getElementById('danger').style.display = "none";
					$.ajax({
						type: "GET",
						url: '/api-front/employer/changePass',
						dataType: "text",
						data: {pass: oldPass, account: accountU, newPass: pass1},
						success: function (msg) {
							if (msg === "yes") {
								alert("修改成功,请重新登录");
								// xadmin.close();
								if ($("#rid").val() === undefined) {
									window.parent.location.href = "/frontLogout";
								} else {
									window.parent.parent.location.href = "/frontLogout";
								}
							} else if (msg === "no") {
								alert("修改失败");
							} else {
								alert("原密码不正确");
							}

						},
						error: function () {
							alert("服务器正忙.....");
						}
					});
				} else {
					layer.msg('密码只能输入6-16个字母、数字、下划线！', {icon: 2});
				}
            }else{
				layer.msg('确认新密码和新密码不一致！', {icon: 2});
            }
		}else{
			layer.msg('信息不完整请输入信息！', {icon: 2});
        }
	}
	$("#pass2").blur(function () {

		var pass1=document.getElementById("pass1").value;
		var pass2=document.getElementById("pass2").value;

		if (pass1===pass2){
			document.getElementById('danger').style.display = "none";
        }else{
			document.getElementById('danger').style.display = "";
        }


	});
	function isPasswd(s){
		var patrn=/^(\w){6,16}$/;
		if (!patrn.exec(s)) return false
		return true
    }

</script>
</html>